<template>
    <Modal :title="title" v-model="show" :loading="loading" @on-cancel="cancel">
        <Form ref="form" :model="data" :label-width="100" label-position="right"
              :rules="rules">
            <FormItem label="ID" prop="ipc_id">
                <Input v-model="data.ipc_id" disabled/>
            </FormItem>
            <FormItem label="是否作为门禁">
                <RadioGroup v-model="ipc_sw_flag">
                    <Radio label="1">
                        <span>是</span>
                    </Radio>
                    <Radio label="0">
                        <span>否</span>
                    </Radio>
                </RadioGroup>
            </FormItem>
            <FormItem label="开关IP" prop="ipc_sw_ip">
                <Input v-model="data.ipc_sw_ip" :disabled="!isGuard"/>
            </FormItem>
            <FormItem label="开关端口号" prop="ipc_sw_port">
                <Input v-model.trim="data.ipc_sw_port" :disabled="!isGuard"/>
            </FormItem>
            <FormItem label="开关通道" prop="ipc_sw_channel">
                <Select v-model="data.ipc_sw_channel" :disabled="!isGuard">
                    <Option value="1">第一路</Option>
                    <Option value="2">第二路</Option>
                </Select>
            </FormItem>
            <FormItem label="开关持续时间" prop="ipc_sw_duration">
                <InputNumber v-model="data.ipc_sw_duration" width="100%" :min="0" :max="99"
                             :disabled="!isGuard"/>
            </FormItem>
        </Form>
        <div slot="footer">
            <Button type="primary" @click="handleSubmit">提交</Button>
        </div>
    </Modal>
</template>

<script>

    import ME from '../../../controllers/ipcSetting'

    export default {
        name: "add-guard-modal",
        props: {
            title: {
                type: String,
                default: "门禁设置"
            },
            update_callback: {
                type: Function,
                default() {
                }

            }
        },
        computed: {
            isGuard() {
                return this.ipc_sw_flag == '1' ? true : false
            }
        },
        data() {
            return {
                show: false,
                rules: {
                    ipc_id: [{required: true, message: '请检查', trigger: 'change'}],
                    ipc_sw_ip: [
                        {required: true, message: '请检查', trigger: 'change'},
                        {
                            pattern: /^((25[0-5]|2[0-4]\d|[01]?\d\d?).){3}(25[0-5]|2[0-4]\d|[01]?\d\d?)$/,
                            message: 'IP不正确',
                            trigger: 'blur'
                        }
                    ],
                    ipc_sw_port: [{required: true, message: '请检查', trigger: 'change'}],
                    ipc_sw_channel: [{required: true, message: '请检查', trigger: 'change'}],
                },
                data: {
                    ipc_id: "",
                    ipc_sw_ip: "",
                    ipc_sw_port: "",
                    ipc_sw_channel: "",
                    ipc_sw_duration: 0,
                },
                ipc_sw_flag: 1,
                loading: false
            }
        },
        methods: {
            handleSubmit() {
                if (!this.isGuard) {
                    ME.updateGuard({
                        ipc_id: this.data.ipc_id
                    }).then(this.callback)
                } else {
                    this.$refs['form'].validate(valid => {
                        if (valid) {
                            ME.updateGuard(this.data).then(this.callback)
                        }
                    })
                }
            },
            callback(json) {
                if (json.code == 0) {
                    this.update_callback()
                    this.show = false
                    this.$Message.success("更新成功")
                }
            },
            cancel() {
                this.$refs['form'].resetFields()
            },
            showAsUpdate(ipc_id, ipc_sw_flag) {
                this.show = true
                this.loading = true
                this.ipc_sw_flag = ipc_sw_flag
                this.data.ipc_id = ipc_id
                if (this.isGuard) {
                    this.loadGuardData(ipc_id)
                }
            },
            loadGuardData(ipc_id) {
                ME.loadGuardData(ipc_id).then(json => {
                    if (json.code == 0) {
                        this.loading = false
                        this.data = {
                            ipc_id: ipc_id,
                            ipc_sw_ip: json.data.ipc_sw_ip,
                            ipc_sw_port: json.data.ipc_sw_port,
                            ipc_sw_channel: json.data.ipc_sw_channel,
                            ipc_sw_duration: Number(json.data.ipc_sw_duration),
                        }
                    } else {
                        this.show = false
                    }
                })
            }

        }
    }
</script>